/* import {
  init,
  classModule,
  propsModule,
  styleModule,
  eventListenersModule,
  h,
} from "snabbdom"; */

import h from "../source/h";
import patch from "../source/patch";
/* const patch = init([
  // Init patch function with chosen modules
  classModule, // makes it easy to toggle classes
  propsModule, // for setting properties on DOM elements
  styleModule, // handles styling on elements with support for animations
  eventListenersModule, // attaches event listeners
]); */

const container = document.getElementById("container");

const vnode = h("ul", { class: { text: true } }, [
  h("li", { key: "A" }, "A"),
  h("li", { key: "B" }, "B"),
  h("li", { key: "C" }, "C"),
]);

const vnode2 = h("ul", { class: { text: true } }, [
  h("li", { key: "A" }, "AA"),
  h("li", { key: "B" }, "B"),
  h("li", { key: "C" }, "CC"),
  h("li", { key: "D" }, "D"),
  h("li", { key: "E" }, "E"),
  h("li", { key: "F" }, "F"),
]);

console.log(vnode2);

btn.onclick = function () {
  patch(vnode, vnode2);
  btn.parentNode.removeChild(btn);
};
patch(container, vnode);
